<template>
	<view>
		<view class="flex-col page">
			<view class="flex-col section space-y-60">
				<view class="flex-row justify-center items-center relative group">
					<image class="image pos" @click="backpage"
						src="https://gongxiangtaiqiu.axa2.com/taiqiu/16777480137488403283.png" />
					<text class="text">数据总览</text>
				</view>
				
			</view>
			<view class="flex-col relative list space-y-20">
				<view class="flex-col list-item">
					<view class="flex-row items-center space-x-10">
						<image class="image_3" src="https://gongxiangtaiqiu.axa2.com/taiqiu/16777400650957483672.png" />
						<text class="font_1">用户</text>
					</view>
					<view class="item">
						<view class="item-lf" style="width: 50%; height: 20px; ">
							<view class="item-name">
								累计访客：<view class="item-num">{{allList.user.ddUser}}人</view>
							</view>

						</view>
						<view class="item-rg" style="width: 50%; height: 20px;">
							<view class="item-name">
								累计用户：<view class="item-num">{{allList.user.user}}人</view>
							</view>
						</view>
					</view>
					<view class="item">
						<view class="item-lf" style="width: 50%; height: 20px; ">
							<view class="item-name">
								累计会员：<view class="item-num">{{allList.user.members}}人</view>
							</view>

						</view>
						<view class="item-rg" style="width: 50%; height: 20px;">
							<view class="item-name">
								累计营业额：<view class="item-num">{{allList.user.turnover}}元</view>
							</view>
						</view>
					</view>
					<view class="item">
						<view class="item-lf" style="width: 50%; height: 20px; ">
							<view class="item-name">
								累计入账：<view class="item-num">{{allList.user.income}}元</view>
							</view>

						</view>

					</view>
				</view>
				<view class="flex-col list-item">
					<view class="flex-row items-center space-x-10">
						<image class="image_3" src="https://gongxiangtaiqiu.axa2.com/taiqiu/16777480137243982889.png" />
						<text class="font_1">桌台</text>
					</view>
					<view class="item">
						<view class="item-lf" style="width: 50%; height: 20px; ">
							<view class="item-name">
								订单数：<view class="item-num">{{allList.zuo.orderNums}}单</view>
							</view>

						</view>
						<view class="item-rg" style="width: 50%; height: 20px;">
							<view class="item-name">
								订单时长：<view class="item-num">{{allList.zuo.long}}</view>
							</view>
						</view>
					</view>
					<view class="item">
						<view class="item-lf" style="width: 50%; height: 20px; ">
							<view class="item-name">
								累计金额：<view class="item-num">{{allList.zuo.money}}元</view>
							</view>

						</view>
						<view class="item-rg" style="width: 50%; height: 20px;">
							<view class="item-name">
								日均订单数：<view class="item-num">{{allList.zuo.aveOrderNums}}单</view>
							</view>
						</view>
					</view>
					<view class="item">
						<view class="item-lf" style="width: 50%; height: 20px; ">
							<view class="item-name">
								日均订单金额：<view class="item-num">{{allList.zuo.aveMoney}}元</view>
							</view>

						</view>
						<view class="item-rg" style="width: 50%; height: 20px;">
							<view class="item-name">
								日均订单时长：<view class="item-num">{{allList.zuo.aveLong}}</view>
							</view>
						</view>
					</view>
				</view>



				<view class="flex-col list-item">
					<view class="flex-row items-center space-x-10">
						<image class="image_3" src="https://gongxiangtaiqiu.axa2.com/taiqiu/16777480137316964275.png" />
						<text class="font_1">棋牌</text>
					</view>
					<view class="item">
						<view class="item-lf" style="width: 50%; height: 20px; ">
							<view class="item-name">
								订单数：<view class="item-num">{{allList.qipai.orderNums}}单</view>
							</view>

						</view>
						<view class="item-rg" style="width: 50%; height: 20px;">
							<view class="item-name">
								订单时长：<view class="item-num">{{allList.qipai.long}}</view>
							</view>
						</view>
					</view>
					<view class="item">
						<view class="item-lf" style="width: 50%; height: 20px; ">
							<view class="item-name">
								累计金额：<view class="item-num">{{allList.qipai.money}}元</view>
							</view>

						</view>
						<view class="item-rg" style="width: 50%; height: 20px;">
							<view class="item-name">
								日均订单数：<view class="item-num">{{allList.qipai.aveOrderNums}}单</view>
							</view>
						</view>
					</view>
					<view class="item">
						<view class="item-lf" style="width: 50%; height: 20px; ">
							<view class="item-name">
								日均订单金额：<view class="item-num">{{allList.qipai.aveMoney}}元</view>
							</view>

						</view>
						<view class="item-rg" style="width: 50%; height: 20px;">
							<view class="item-name">
								日均订单时长：<view class="item-num">{{allList.qipai.aveLong}}</view>
							</view>
						</view>
					</view>
				</view>




				<view class="flex-col list-item">
					<view class="flex-row items-center space-x-10">
						<image class="image_3" src="https://gongxiangtaiqiu.axa2.com/taiqiu/16777480137360536822.png" />
						<text class="font_1">存杆柜</text>
					</view>
					<view class="item">
						<view class="item-lf" style="width: 50%; height: 20px; ">
							<view class="item-name">
								订单数：<view class="item-num">891单</view>
							</view>

						</view>
						<view class="item-rg" style="width: 50%; height: 20px;">
							<view class="item-name">
								订单时长：<view class="item-num">12h12m</view>
							</view>
						</view>
					</view>
					<view class="item">
						<view class="item-lf" style="width: 50%; height: 20px; ">
							<view class="item-name">
								累计金额：<view class="item-num">12123元</view>
							</view>

						</view>
						<view class="item-rg" style="width: 50%; height: 20px;">
							<view class="item-name">
								日均订单数：<view class="item-num">19.82单</view>
							</view>
						</view>
					</view>
					<view class="item">
						<view class="item-lf" style="width: 50%; height: 20px; ">
							<view class="item-name">
								日均订单金额：<view class="item-num">987元</view>
							</view>

						</view>
						<view class="item-rg" style="width: 50%; height: 20px;">
							<view class="item-name">
								日均订单时长：<view class="item-num">22h34m</view>
							</view>
						</view>
					</view>
				</view>

				<view class="flex-col list-item">
					<view class="flex-row items-center space-x-10">
						<image class="image_3" style="width: 30rpx; height: 35rpx;"
							src="https://gongxiangtaiqiu.axa2.com/taiqiu/16777480137428277377.png" />
						<text class="font_1">售货机</text>
					</view>
					<view class="item">
						<view class="item-lf" style="width: 50%; height: 20px; ">
							<view class="item-name">
								订单数：<view class="item-num">121单</view>
							</view>

						</view>
						<view class="item-rg" style="width: 50%; height: 20px;">
							<view class="item-name">
								订单金额：<view class="item-num">12123元</view>
							</view>
						</view>
					</view>
					<view class="item">
						<view class="item-lf" style="width: 50%; height: 20px; ">
							<view class="item-name">
								订单金额：<view class="item-num">1982元</view>
							</view>

						</view>
						<view class="item-rg" style="width: 50%; height: 20px;">
							<view class="item-name">
								日均订单数：<view class="item-num">0.9单</view>
							</view>
						</view>
					</view>
				</view>
				
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		components: {},
		data() {
			return {
				show: false,
				allList:{}
			};
		},
		onLoad() {
			this.getdata()
		},
		methods: {
			getdata(){
				this.$Api.overViewData({
					shopId: uni.getStorageSync('Bshop_id'),
				}).then(res => {
					this.allList = res.data.data
					console.log(res.data.data, '成功')
				}, err => {})
			},
			backpage() {
				uni.navigateBack({
					delta: 1
				})
			}
		},
	};
</script>

<style>
	/************************************************************
	** 请将全局样式拷贝到项目的全局 CSS 文件或者当前页面的顶部 **
	** 否则页面将无法正常显示                                  **
	************************************************************/

	html {
		font-size: 16px;
	}

	body {
		margin: 0;
		font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans',
			'Droid Sans', 'Helvetica Neue', 'Microsoft Yahei', sans-serif;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}

	view,
	image,
	text {
		box-sizing: border-box;
		flex-shrink: 0;
	}

	#app {
		width: 100vw;
		height: 100vh;
	}

	.flex-row {
		display: flex;
		flex-direction: row;
	}

	.flex-col {
		display: flex;
		flex-direction: column;
	}

	.justify-start {
		justify-content: flex-start;
	}

	.justify-end {
		justify-content: flex-end;
	}

	.justify-center {
		justify-content: center;
	}

	.justify-between {
		justify-content: space-between;
	}

	.justify-around {
		justify-content: space-around;
	}

	.justify-evenly {
		justify-content: space-evenly;
	}

	.items-start {
		align-items: flex-start;
	}

	.items-end {
		align-items: flex-end;
	}

	.items-center {
		align-items: center;
	}

	.items-baseline {
		align-items: baseline;
	}

	.items-stretch {
		align-items: stretch;
	}

	.self-start {
		align-self: flex-start;
	}

	.self-end {
		align-self: flex-end;
	}

	.self-center {
		align-self: center;
	}

	.self-baseline {
		align-self: baseline;
	}

	.self-stretch {
		align-self: stretch;
	}

	.flex-1 {
		flex: 1 1 0%;
	}

	.flex-auto {
		flex: 1 1 auto;
	}

	.grow {
		flex-grow: 1;
	}

	.grow-0 {
		flex-grow: 0;
	}

	.shrink {
		flex-shrink: 1;
	}

	.shrink-0 {
		flex-shrink: 0;
	}

	.relative {
		position: relative;
	}

	.page {
		padding-bottom: 92rpx;
		background-color: #f3f3f5;
		height: 100%;
		width: 100%;
		overflow-y: auto;
		overflow-x: hidden;
	}

	.section {
		padding: 99rpx 23rpx 495rpx;
		background-image: linear-gradient(0deg, #f3f3f5 0%, #19c865 61%, #19c865 100%);
	}

	.space-y-60>view:not(:first-child),
	.space-y-60>text:not(:first-child),
	.space-y-60>image:not(:first-child) {
		margin-top: 60rpx;
	}

	.group {
		padding-top: 6rpx;
	}

	.image {
		width: 20rpx;
		height: 35rpx;
	}

	.pos {
		position: absolute;
		left: 0;
		top: 50%;
		transform: translateY(-50%);
	}

	.text {
		color: #ffffff;
		font-size: 36rpx;
		font-family: PingFang SC;
		font-weight: 700;
		line-height: 34rpx;
	}

	.group_2 {
		padding: 0 8rpx;
	}

	.text_2 {
		color: #ffffff;
		font-size: 32rpx;
		font-family: PingFang SC;
		font-weight: 700;
		line-height: 31rpx;
	}

	.space-x-7>view:not(:first-child),
	.space-x-7>text:not(:first-child),
	.space-x-7>image:not(:first-child) {
		margin-left: 7rpx;
	}

	.text_3 {
		color: #ffffff;
		font-size: 24rpx;
		font-family: PingFang SC;
		font-weight: 700;
		line-height: 23rpx;
	}

	.image_2 {
		width: 24rpx;
		height: 22rpx;
	}

	.list {
		margin-top: -455rpx;
		padding: 0 30rpx;
	}

	.space-y-20>view:not(:first-child),
	.space-y-20>text:not(:first-child),
	.space-y-20>image:not(:first-child) {
		margin-top: 20rpx;
	}

	.list-item {
		padding: 36rpx 13rpx 40rpx 30rpx;
		background-color: #ffffff;
		border-radius: 13.5rpx;
	}

	.space-x-10>view:not(:first-child),
	.space-x-10>text:not(:first-child),
	.space-x-10>image:not(:first-child) {
		margin-left: 10rpx;
	}

	.item {
		width: 100%;
		height: 20px;
		margin-top: 20rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.item-name {
		width: 170rpx;
		height: 25rpx;
		font-size: 26rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #6B6B6B;
		display: inline;
	}

	.item-num {
		width: 100rpx;
		height: 23rpx;
		font-size: 26rpx;
		font-family: PingFang SC;
		font-weight: bold;
		color: #222222;
		display: inline;
	}

	.image_3 {
		width: 30rpx;
		height: 30rpx;
	}

	.font_1 {
		font-size: 28rpx;
		font-family: PingFang SC;
		line-height: 27rpx;
		font-weight: 700;
		color: #222222;
	}

	.group_3 {
		margin-top: 22rpx;
	}

	.font_2 {
		font-size: 26rpx;
		font-family: PingFang SC;
		line-height: 25rpx;
		font-weight: 500;
		color: #6b6b6b;
	}

	.group_4 {
		line-height: 25rpx;
		height: 25rpx;
	}

	.font_4 {
		font-size: 26rpx;
		font-family: PingFang SC;
		line-height: 20rpx;
		font-weight: 700;
		color: #222222;
	}

	.font_3 {
		font-size: 26rpx;
		font-family: PingFang SC;
		line-height: 25rpx;
		font-weight: 500;
		color: #222222;
	}

	.group_5 {
		margin-right: 54rpx;
	}

	.group_6 {
		margin-top: 29rpx;
	}

	.text_4 {
		line-height: 19rpx;
	}

	.space-x-23>view:not(:first-child),
	.space-x-23>text:not(:first-child),
	.space-x-23>image:not(:first-child) {
		margin-left: 23rpx;
	}

	.group_7 {
		line-height: 23rpx;
		height: 23rpx;
	}

	.font_5 {
		font-size: 26rpx;
		font-family: PingFang SC;
		line-height: 23rpx;
		font-weight: 700;
		color: #222222;
	}

	.text_5 {
		font-weight: 500;
	}

	.group_8 {
		margin-top: 29rpx;
	}

	.space-x-51>view:not(:first-child),
	.space-x-51>text:not(:first-child),
	.space-x-51>image:not(:first-child) {
		margin-left: 25rpx;
	}

	.space-x-49>view:not(:first-child),
	.space-x-49>text:not(:first-child),
	.space-x-49>image:not(:first-child) {
		margin-left: 29rpx;
	}
</style>
